<!-- 热门商品分类 -->
<template>
	<div>
		<div class="image-container">
		<div v-for="(item,index) in hostimage" :key="index" class="image-item">
			<img :src="item.image" alt="" />
		</div>
		
	</div>
	<div class="maxhotimg">
		<img src="../assets/img/hotgoods/c5.png" alt="" />
	</div>
	</div>
	
</template>

<script>
	export default{
		data() {
			return{
				hostimage:[{
					image:require('../assets/img/hotgoods/c.png')
				},
				{
					image:require('../assets/img/hotgoods/c2.png')
				},
				{
					image:require('../assets/img/hotgoods/c4.png')
				},
				{
					image:require('../assets/img/hotgoods/c3.png')
				},
				{
					image:require('../assets/img/hotgoods/c1.png')
				}]
			}
		}
	}
</script>

<style scoped>
	.image-container {
		/* width: 1200px; */
		display: flex;
	}
	
	.image-item {
		flex: 1; /* 每个项目平均分配空间 */
	}
	
	.image-item img {
		width: 100%;
		height: auto;
		display: block;
	}
	.maxhotimg img{
		width: 1200px;
		height: 151px;
		padding: 20px 0;
	}
</style>